/**
 * @file icon-button
 * @author liaoxuezhi@baidu.com
 */
/* eslint fecs-indent: [0, "space", 2, 2] */

import * as React from 'react';
import {
  PureComponent,
  PropTypes
} from 'react';
import {Renderer, render} from './renderer';
import OnExpression from './hoc/on-expression';
import * as cx from 'classnames';
import * as schema from './button-group-schema.json';

@Renderer({
  name: 'button-group',
  desc: '...',
  test: (path, config) => /\/button-group$/.test(path),
  schema
})
@OnExpression
export default class BtnGroup extends PureComponent {
  static propTypes = {
    className: PropTypes.string,
    onRequestAction: PropTypes.func,
    location: PropTypes.object,
    buttons: PropTypes.arrayOf(PropTypes.shape({
      type: PropTypes.oneOf(['button', 'action'])
    })).isRequired
  };

  static defaultProps = {
    className: '',
    btnClassName: 'btn-default'
  };

  render() {
    const {
      className,
      buttons,
      disabled,
      values,
      locals,
      item,
      onRequestAction,
      btnClassName,
      $path,
      data
    } = this.props;

    return (
      <div className={cx('btn-group', className)}>
        {buttons.map((button, key) => render(`${$path}/action`, button, {
          className: cx(button.className, btnClassName),
          key,
          values,
          data,
          item,
          locals,
          disabled: disabled || button.disabled,
          onRequestAction: onRequestAction
        }))}
      </div>
    );
  }
}
